<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link href="../../layuiadmin/layui/css/layui.css" rel="stylesheet" />
		<link href="../../layuiadmin/style/admin.css" rel="stylesheet" />

	</head>

	<body>
		<form class="layui-form layui-form-pane" action="" style="margin: 5px;">
			<div class="layui-form-item">
				<label class="layui-form-label">用户名：</label>
				<div class="layui-input-block">
					<input type="text" name="useranme" lay-verify="username" autocomplete="off" placeholder="请输入你的用户名" class="layui-input" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">密码：</label>
				<div class="layui-input-inline">
					<input type="password" name="password" lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input">
				</div>
				<div class="layui-form-mid layui-word-aux">请填写6到12位密码</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">手机号码：</label>
					<div class="layui-input-inline">
						<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
					</div>
				</div>

				<div class="layui-inline">
					<label class="layui-form-label">邮箱地址：</label>
					<div class="layui-input-inline">
						<input type="text" name="email" lay-verify="email" autocomplete="off" class="layui-input">
					</div>
				</div>
			</div>
			<div class="layui-form">
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">出生日期</label>
						<div class="layui-input-inline">
							<input type="text" class="layui-input" id="test1" placeholder="yyyy-MM-dd">
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">性别：</label>
					<div class="layui-input-block">
						<input type="radio" name="sex" value="男" title="男" checked="">
						<input type="radio" name="sex" value="女" title="女">
						<input type="radio" name="sex" value="禁" title="禁用" disabled="">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">兴趣爱好：</label>
					<div class="layui-input-block">
						<select name="interest" lay-filter="aihao">
							<option value=""></option>
							<option value="0">写作</option>
							<option value="1" selected="">阅读</option>
							<option value="2">游戏</option>
							<option value="3">音乐</option>
							<option value="4">旅行</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item" pane="">
					<label class="layui-form-label">专业技能：</label>
					<div class="layui-input-block">
						<input type="checkbox" name="like1[write]" lay-skin="primary" title="java" checked="">
						<input type="checkbox" name="like1[write]" lay-skin="primary" title="layui" checked="">
						<input type="checkbox" name="like1[read]" lay-skin="primary" title="JavaScript">

						<input type="checkbox" name="like1[read]" lay-skin="primary" title="iview">
						<input type="checkbox" name="like1[game]" lay-skin="primary" title="vue" disabled="">
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
		</form>

		<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
		<script src="../../layuiadmin/layui/layui.js"></script>
		<script>
			layui.use(['form', 'laydate'], function() {
				var form = layui.form,
					laydate = layui.laydate;
					//监听提交
             form.on('submit(demo1)', function(data){
             layer.msg(JSON.stringify(data.field));
                    return false;
                       });

				form.verify({
					username: function(value) {
						if(value.length < 3) {
							return '用户名至少得3个字符啊';
						}
					},
					pass: [/(.+){6,12}$/, '密码必须6到12位'],
					content: function(value) {
						layedit.sync(editIndex);
					}
				});

				laydate.render({
					elem: '#test1'
				})
			})
		</script>
	</body>

</html>